<template>
  <div class="edit-page">
    <dt-modal-edit ref="editRef" title="编辑人员" @ok="onOk" :width="800">
      <dt-info ref="msgRef"></dt-info>
    </dt-modal-edit>
    <!--重置密码-->
    <dt-modal-edit
      ref="resetPwdRef"
      title="密码重置确认"
      okText="立即重置"
      @ok="resetPwdFun"
      :transfer="true">
      <p>请确认，是否对{{ msgInfo.userName + '(' + msgInfo.workNo + ')' }}的登录密码进行重置？</p>
    </dt-modal-edit>
    <!--复制密码-->
    <dt-modal-edit ref="copyPwdRef" title="密码已重置" okText="复制密码" cancelText="关闭" @ok="copyPwdFun">
      <p>
        {{ msgInfo.userName + '(' + msgInfo.workNo + ')' }}的登录密码已重置为：
        <span style="color: #d9001b">{{ passwordText }}</span>
      </p>
    </dt-modal-edit>
  </div>
</template>
<script setup>
  import { ref, reactive } from 'vue'
  import { editOpt } from '../biz/edit'
  import dt from '@dt/dt'
  import employeeMgr from '../biz/index'

  const emits = defineEmits(['search'])
  const [editRef, msgRef, resetPwdRef, copyPwdRef] = [ref(), ref(), ref(), ref()]
  let passwordText = ref('')
  let msgInfo = reactive({
    id: null,
    userName: '',
    workNo: '',
    phone: '',
    password: '',
    roleIds: []
  })

  const fun = {
    resetPassWord: (row) => {
      resetPwdRef.value.show()
    }
  }

  function show(curRow) {
    msgInfo = dt.tool.deepClone(curRow)
    editRef.value.show()
    msgRef.value.init(new editOpt(fun), msgInfo)
  }

  function onOk() {
    let params = {
      id: msgInfo.id,
      phone: msgInfo.phone,
      roleIds: msgInfo.roleIds,
      userName: msgInfo.userName
    }
    employeeMgr.editSysUser(params).then((res) => {
      dt.ui.Message.success('编辑成功。')
      emits('search')
      editRef.value.hide()
    })
  }

  function resetPwdFun() {
    let num = ''
    for (var i = 0; i < 3; i++) {
      num += Math.floor(Math.random() * 10)
    }
    passwordText.value = 'Password' + num
    let params = { phone: msgInfo.phone, password: passwordText.value, confirmPwd: passwordText.value }
    employeeMgr.updatePwd(params).then((res) => {
      emits('search')
      editRef.value.hide()
    })

    resetPwdRef.value.hide()
    copyPwdRef.value.show()
  }
  function copyPwdFun() {
    const aux = document.createElement('input')
    aux.setAttribute('value', passwordText.value)
    document.body.appendChild(aux)
    aux.select()
    document.execCommand('copy')
    document.body.removeChild(aux)
    dt.ui.Message.success('复制成功')
    copyPwdRef.value.hide()
  }
  defineExpose({ show })
</script>

<style lang="scss" scoped>
  .edit-page {
    .store-role {
      line-height: 50px;
    }
    .store-name {
      color: #3366ff;
      margin-right: 10px;
    }
  }
</style>
